@model PaginatedList<Game>
<div class="pending-games">
    @if (Model.Count > 0) {
        <ul id="pendingGamesList">
        @foreach (var game in Model) { 
            <li>@using (Html.BeginForm("Join", "Games")) {
                <div>
                    @Html.Hidden("id", game.GameID)
                    @string.Format("{0:t} - {1}", game.CreatedOn, game.Player1.UserName)
                    <input type="submit" value="Join" />
                </div>
                }
            </li>
        }
        </ul>
    
        if (Model.HasPreviousPage) {
            @Ajax.RouteLink("<<< Prev", "Default", new { page = (Model.PageIndex) }, new AjaxOptions { UpdateTargetId="pendingGames" })
        }
        if (Model.HasNextPage) {
            @Ajax.RouteLink("Next >>>", "Default", new { page = (Model.PageIndex+2) }, new AjaxOptions { UpdateTargetId = "pendingGames" })
        }
    }
    else {
        <p class="none">
            There are currently no pending games to join<br />
        </p>
    }
    <p class="refresh-link">
        @Ajax.ActionLink("refresh", "Lobby", new { page = (Model.PageIndex + 1) },
            new AjaxOptions { UpdateTargetId = "pendingGames" },
            new { id="pendingGamesRefreshLink" })
    </p>
</div>